<template>
  <transition :name="transitionName" appear @enter="handleEnter" @leave="handleLeave">
    <div :class="classes" :style="styles">
      <template v-if="type === 'notice'">
        <div :class="contentClasses" ref="content" v-html="content"></div>
        <div :class="contentWithIcon">
          <render-cell :render="renderFunc" />
        </div>
        <a :class="[baseClass + '-close']" @click="close" v-if="closable">
          <i :class="iconClass"></i>
        </a>
      </template>
      <template v-if="type === 'message'">
        <div :class="[baseClass + '-content']" ref="content">
          <div :class="[baseClass + '-content-text']" v-html="content"></div>
          <div :class="[baseClass + '-content-text']">
            <render-cell :render="renderFunc" />
          </div>
          <a :class="[baseClass + '-close']" @click="close" v-if="closable">
            <i :class="iconClass"></i>
          </a>
        </div>
      </template>
    </div>
  </transition>
</template>
<script type="text/ecmascript-6"  src="./index.js"></script>
